import { CheckCard, CheckCardGroupProps } from '@ant-design/pro-components';
import lodash from 'lodash';
import React from 'react';

export type SfwCheckCardProps = {
  title?: (record: Record<string, any>) => React.ReactNode;
  description?: (record: Record<string, any>) => React.ReactNode;
  avatar?: (record: Record<string, any>) => React.ReactNode;
  cover?: (record: Record<string, any>) => React.ReactNode;
  onChange?: (checked: boolean, record: Record<string, any>) => void;
} & CheckCardGroupProps;

const SfwCheckCard: React.FC<SfwCheckCardProps> = (props) => {
  const {
    title,
    description,
    avatar,
    cover,
    onChange,
    options: optionsProps,
    ...restProps
  } = props;
  const options: any[] = lodash.map(optionsProps, (record: any) => {
    return {
      ...record,
      title: title?.(record),
      description: description?.(record),
      avatar: avatar?.(record),
      cover: cover?.(record),
      onChange: (checked: boolean) => onChange?.(checked, record),
    };
  });

  return <CheckCard.Group options={options} {...restProps} />;
};

export default SfwCheckCard;
